/**
 * Created by ll on 17/11/2017.
 * type：类型：1.普通文本框 2.时间文本框 3.下拉框
 */
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Form, Input, DatePicker, Radio, Select, Cascader, Button, Tooltip, Icon, Row, Col } from 'antd'
import moment from 'moment'
import style from '../../containers/Detail/style.less'
import store from 'store'
import 'moment/locale/zh-cn'
moment.locale('zh-cn')
const queryList = store.get('crm:queryList')
const RadioGroup = Radio.Group
const FormItem = Form.Item
const Option = Select.Option
// const AutoCompleteOption = AutoComplete.Option
const region = queryList && queryList.region && queryList.region.data && queryList.region.data.areas

// 地区数据结构
const residences = (region || []).map((d, i) => {
  let obj = {}
  const sub = d.sublist
  obj.value = d.code
  obj.label = d.value
  obj.children = sub.map((val, i) => {
    let childobj = {}
    childobj.value = val.code
    childobj.label = val.value
    return childobj
  })
  return obj
})

// const residences = [{
//   value: 'zhejiang',
//   label: 'Zhejiang',
//   children: [{
//     value: 'hangzhou',
//     label: 'Hangzhou',
//     children: [{
//       value: 'xihu',
//       label: 'West Lake',
//     }],
//   }],
// }, {
//   value: 'jiangsu',
//   label: 'Jiangsu',
//   children: [{
//     value: 'nanjing',
//     label: 'Nanjing',
//     children: [{
//       value: 'zhonghuamen',
//       label: 'Zhong Hua Men',
//     }],
//   }],
// }]

class ListTextEnterpriseAdd extends Component { // 企业表单提交
  static propTypes = {
    form: PropTypes.any,
    clueDetail: PropTypes.object,
    parsed: PropTypes.object,
    addClue: PropTypes.func,
    editClue: PropTypes.func,
    checkExterpriseName: PropTypes.func,
    location: PropTypes.object,
  }

  state = {
    confirmDirty: false,
    autoCompleteResult: [],
  }
  handleSubmit = (e) => {
    e.preventDefault()
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        console.log('Received values of form: ', values)
      }
    })
  }
  handleConfirmBlur = (e) => {
    const value = e.target.value
    this.setState({ confirmDirty: this.state.confirmDirty || !!value })
  }
  // checkPassword = (rule, value, callback) => {
  //   const form = this.props.form
  //   if (value && value !== form.getFieldValue('password')) {
  //     callback('Two passwords that you enter is inconsistent!')
  //   } else {
  //     callback()
  //   }
  // }
  checkConfirm = (rule, value, callback) => {
    const form = this.props.form
    if (value && this.state.confirmDirty) {
      form.validateFields(['confirm'], { force: true })
    }
    callback()
  }

  handleWebsiteChange = (value) => {
    let autoCompleteResult
    if (!value) {
      autoCompleteResult = []
    } else {
      autoCompleteResult = ['.com', '.org', '.net'].map(domain => `${value}${domain}`)
    }
    this.setState({ autoCompleteResult })
  }

  handleChange = (value) => {
    console.log(`selected ${value}`)
  }

  onChange = (date, dateString) => {
    console.log(date, dateString)
  }

  radioOnChange = (e) => {
    console.log('radio checked', e.target.value)
    this.setState({
      value: e.target.value,
    })
  }
  operateClue = (action) => {
    console.log(action)
    const id = this.props.location.state.id
    if (action === 1) {
      this.props.addClue()
    }
    if (action === 2) {
      this.props.editClue(id)
    }
  }

  render() {
    console.log(this.props)
    const { clueDetail } = this.props
    const address = clueDetail.address || '050000050100'
    const province = address.slice(0, 6)
    const city = address.slice(6, 12)
    const { action } = this.props.parsed
    if (action === '1') {
      // clueDetail.isBuild = '1'
      // clueDetail.isGroup = '1'
    }
    let [valueDate, openValue] = [null, null]
    if (action === '2') {
      [valueDate, openValue] = [moment(clueDetail.establDate, 'YYYY-MM-DD'), moment(clueDetail.openingTime, 'YYYY-MM-DD')]
    }
    const { getFieldDecorator } = this.props.form
    // const { autoCompleteResult } = this.state
    const [
      // props,
      industryList,
      categoryList,
      customerSourceList,
      superiorUnitList,
      scaleList,
      isGroupList,
      starList,
      isBuildList] = [
      // this.props,
      queryList.exIndustryType,
      queryList.enCategory,
      queryList.exSource,
      queryList.enSuperiorUnit,
      queryList.enScale,
      queryList.enIsGroup,
      queryList.enStar,
      queryList.enIsBuild]

    const formItemLayout = {
      labelCol: {
        xs: { span: 18 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 20 },
        sm: { span: 14 },
      },
    }
    const tailFormItemLayout = {
      wrapperCol: {
        xs: {
          span: 24,
          offset: 0,
        },
        sm: {
          span: 14,
          offset: 6,
        },
      },
    }
    // const prefixSelector = getFieldDecorator('prefix', {
    //   initialValue: '86',
    // })(
    //   <Select style={{ width: 60 }}>
    //     <Option value="86">+86</Option>
    //     <Option value="87">+87</Option>
    //   </Select>
    // )
    //
    // const websiteOptions = autoCompleteResult.map(website => (
    //   <AutoCompleteOption key={website}>{website}</AutoCompleteOption>
    // ))
    // console.log(this.props)
    // const { clueDetail } = this.props
    return (
      <Form onSubmit={this.handleSubmit}>
        <FormItem
          {...formItemLayout}
          label="企业名称"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('enterpriseName', {
                initialValue: clueDetail.enterpriseName,
                rules: [{required: true, message: '请填写企业名称!'}],
              })(
                <Input placeholder="请输入企业名称" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkExterpriseName}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="企业所在地"
        >
          {getFieldDecorator('address', {
            initialValue: [province, city],
            rules: [{ type: 'array', required: true, message: '请选择企业所在地!' }],
          })(
            <Cascader options={residences} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="企业所在地详细地址"
          hasFeedback
        >
          {getFieldDecorator('addressDetail', {
            initialValue: clueDetail.addressDetail,
            rules: [{required: true, message: '请填写企业所在地详细地址!'}],
          })(
            <Input placeholder="请输入企业所在地详细地址" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="行业类别"
          hasFeedback
        >
          {getFieldDecorator('industryType', {
            initialValue: clueDetail.industryType,
            rules: [{required: true, message: '请选择行业类别!'}],
          })(
            <Select
              showSearch
              placeholder="请选择行业类别"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                industryList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="星级"
          hasFeedback
        >
          {getFieldDecorator('star', {
            initialValue: clueDetail.star,
            rules: [{required: false, message: '请选择星级!'}],
          })(
            <Select
              showSearch
              placeholder="请选择星级"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                starList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="企业类型"
          hasFeedback
        >
          {getFieldDecorator('category', {
            initialValue: clueDetail.category,
            rules: [{required: false, message: '请选择企业类型!'}],
          })(
            <Select
              showSearch
              placeholder="请选择企业类型"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                categoryList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="企业规模"
          hasFeedback
        >
          {getFieldDecorator('scale', {
            initialValue: clueDetail.scale,
            rules: [{required: false, message: '请选择企业规模!'}],
          })(
            <Select
              showSearch
              placeholder="请选择企业规模"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                scaleList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="注册资金"
          hasFeedback
        >
          {getFieldDecorator('capital', {
            initialValue: clueDetail.capital,
            rules: [{
              required: false,
              message: '请填写注册资金!',
            }, {
              validator(rule, values, callback) {
                callback(!(/^[0-9]*$/.test(values || '')) ? `注册资金格式错误` : undefined)
              },
            }],
          })(
            <Input placeholder="请输入注册资金" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="法人代表"
          hasFeedback
        >
          {getFieldDecorator('legalRe', {
            initialValue: clueDetail.legalRe,
            rules: [{required: false, message: '请填写法人代表!'}],
          })(
            <Input placeholder="请输入法人代表" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="成立日期"
          hasFeedback
        >
          {getFieldDecorator('establDate', {
            initialValue: valueDate,
            rules: [{required: true, message: '请选择成立日期!'}],
          })(
            <DatePicker onChange={this.onChange} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label={(
            <span>
              公司网址&nbsp;
              <Tooltip title="示例：https://www.baidu.com/">
                <Icon type="question-circle-o" />
              </Tooltip>
            </span>
          )}
          hasFeedback
        >
          {getFieldDecorator('companyWebsite', {
            initialValue: clueDetail.companyWebsite,
            rules: [{
              required: false,
              message: '请填写公司网址!',
            }],
          })(
            <Input placeholder="请输入公司网址" />
          )}
        </FormItem>

        <FormItem
          {...formItemLayout}
          label="是否筹建"
          hasFeedback
        >
          {getFieldDecorator('isBuild', {
            initialValue: clueDetail.isBuild,
          })(
            <Select
              showSearch
              placeholder="是否筹建"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                isBuildList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>

        <FormItem
          {...formItemLayout}
          label="开业时间"
          hasFeedback
        >
          {getFieldDecorator('openingTime', {
            initialValue: openValue,
            rules: [{required: true, message: '请选择开业时间!'}],
          })(
            <DatePicker onChange={this.onChange} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="是否集团"
          hasFeedback
        >
          {getFieldDecorator('isGroup', {
            initialValue: clueDetail.isGroup,
          })(
            <Select
              showSearch
              placeholder="是否集团"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                isGroupList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="上级单位"
          hasFeedback
        >
          {getFieldDecorator('superiorUnit', {
            initialValue: clueDetail.superiorUnit,
            rules: [{required: false, message: '请选择上级单位!'}],
          })(
            <Select
              showSearch
              placeholder="请选择上级单位"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                superiorUnitList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="客户来源"
          hasFeedback
        >
          {getFieldDecorator('customerSource', {
            initialValue: clueDetail.customerSource,
            rules: [{required: true, message: '请选择客户来源!'}],
          })(
            <Select
              showSearch
              placeholder="请选择客户来源"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                customerSourceList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="账号编码"
          hasFeedback
        >
          {getFieldDecorator('accountCode', {
            initialValue: clueDetail.accountCode,
            rules: [{required: false, message: '请填写账号编码!'}],
          })(
            <Input placeholder="请输入账号编码" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="企业简介"
          hasFeedback
        >
          {getFieldDecorator('enterpriseProfile', {
            initialValue: clueDetail.enterpriseProfile,
            rules: [{required: false, message: '请填写企业简介!'}],
          })(
            <Input placeholder="请输入企业简介" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="备注"
          hasFeedback
        >
          {getFieldDecorator('remarks', {
            initialValue: clueDetail.remarks,
            rules: [{required: false, message: '请填写备注!'}],
          })(
            <Input placeholder="请输入备注" />
          )}
        </FormItem>
        <FormItem {...tailFormItemLayout}>
          <Button type="primary" onClick={() => { this.operateClue(action) }}>提交</Button>
        </FormItem>
      </Form>
    )
  }
}

class ListTextPersonAdd extends Component { // 个人表单提交
  static propTypes = {
    clueDetail: PropTypes.object,
    form: PropTypes.any,
    parsed: PropTypes.object,
    location: PropTypes.object,
    addClue: PropTypes.func,
    editClue: PropTypes.func,
    checkCustomerName: PropTypes.func,
    checkPersonalPhone: PropTypes.func,
    checkWorkPhone: PropTypes.func,
    checkWeChat: PropTypes.func,
    checkIdCard: PropTypes.func,
  }

  state = {
    confirmDirty: false,
    autoCompleteResult: [],
  };
  handleSubmit = (e) => {
    e.preventDefault()
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        console.log('Received values of form: ', values)
      }
    })
  }
  handleConfirmBlur = (e) => {
    const value = e.target.value
    this.setState({ confirmDirty: this.state.confirmDirty || !!value })
  }
  checkConfirm = (rule, value, callback) => {
    const form = this.props.form
    if (value && this.state.confirmDirty) {
      form.validateFields(['confirm'], { force: true })
    }
    callback()
  }

  handleWebsiteChange = (value) => {
    let autoCompleteResult
    if (!value) {
      autoCompleteResult = []
    } else {
      autoCompleteResult = ['.com', '.org', '.net'].map(domain => `${value}${domain}`)
    }
    this.setState({ autoCompleteResult })
  }

  handleChange = (value) => {
    console.log(`selected ${value}`)
  }

  onChange = (date, dateString) => {
    console.log(date, dateString)
  }

  radioOnChange = (e) => {
    console.log('radio checked', e.target.value)
    this.setState({
      value: e.target.value,
    })
  }
  operateClue = (action) => {
    console.log(action)
    const id = this.props.location.state.id
    if (action === 1) {
      this.props.addClue()
    }
    if (action === 2) {
      this.props.editClue(id)
    }
  }

  render() {
    console.log(this.props)
    const { clueDetail } = this.props
    const [residence, address] = [clueDetail.residence || '050000050100', clueDetail.address || '050000050100']
    const [residenceProvince, residenceCity, addressProvince, addressCity] = [
      residence.slice(0, 6),
      residence.slice(6, 12),
      address.slice(0, 6),
      address.slice(6, 12)]
    const { getFieldDecorator } = this.props.form
    // const { autoCompleteResult } = this.state
    const [props, customerSourceList, educationList, isSex] = [
      this.props,
      queryList.exSource,
      queryList.peEducation,
      queryList.peSex]
    const { action } = this.props.parsed
    if (action === '1') {
    }
    let [birthDate, graduateValue] = [null, null]
    if (action === '2') {
      [birthDate, graduateValue] = [moment(clueDetail.birthday, 'YYYY-MM-DD'), moment(clueDetail.graduationTime, 'YYYY-MM-DD')]
      console.log(clueDetail.birthday)
      if (clueDetail.birthday === null || clueDetail.graduationTime === null) {
        birthDate = moment()
        graduateValue = moment()
      }
    }

    const formItemLayout = {
      labelCol: {
        xs: { span: 18 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 20 },
        sm: { span: 14 },
      },
    }
    const tailFormItemLayout = {
      wrapperCol: {
        xs: {
          span: 24,
          offset: 0,
        },
        sm: {
          span: 14,
          offset: 6,
        },
      },
    }
    return (
      <Form onSubmit={this.handleSubmit}>
        <FormItem
          {...formItemLayout}
          label="客户姓名"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('customerName', {
                initialValue: clueDetail.customerName,
                rules: [{required: true, message: '请填写客户姓名!'}],
              })(
                <Input placeholder="请输入客户姓名" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkCustomerName}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="个人手机"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('personalPhone', {
                initialValue: clueDetail.personalPhone,
                rules: [{
                  required: false,
                  message: '请填写个人手机!',
                }, {
                  validator(rule, values, callback) {
                    callback(!(/^((1[34578]\d{9})|)$/.test(values || '')) ? `个人手机格式错误` : undefined)
                  },
                }],
              })(
                <Input placeholder="请输入个人手机" maxLength="11" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkPersonalPhone}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="工作手机"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('workPhone', {
                initialValue: clueDetail.workPhone,
                rules: [{
                  required: false,
                  message: '请填写工作手机!',
                }, {
                  validator(rule, values, callback) {
                    callback(!(/^((1[34578]\d{9})|)$/.test(values || '')) ? `工作手机格式错误` : undefined)
                  },
                }],
              })(
                <Input placeholder="请输入工作手机" maxLength="11" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkWorkPhone}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="微信"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('weChat', {
                initialValue: clueDetail.weChat,
                rules: [{
                  required: false,
                  message: '请填写微信!',
                }],
              })(
                <Input placeholder="请输入微信" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkWeChat}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="身份证"
        >
          <Row gutter={8}>
            <Col span={22}>
              {getFieldDecorator('idCard', {
                initialValue: clueDetail.idCard,
                rules: [{
                  required: false,
                  message: '请填写身份证!',
                }, {
                  validator(rule, values, callback) {
                    callback(!(/^\d{15}|\d{18}$/.test(values || '')) ? `身份证格式错误` : undefined)
                  },
                }],
              })(
                <Input placeholder="请输入身份证" maxLength="18" />
              )}
            </Col>
            <Col span={2}>
              <Button type="primary" onClick={this.props.checkIdCard}>查重</Button>
            </Col>
          </Row>
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="性别"
          hasFeedback
        >
          {getFieldDecorator('sex', {
            initialValue: clueDetail.sex,
            rules: [{required: true, message: '请选择性别!'}],
          })(
            <Select {...props}
              showSearch
              placeholder="请选择性别"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                isSex.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="固定电话"
          hasFeedback
        >
          {getFieldDecorator('fixedPhone', {
            initialValue: clueDetail.fixedPhone,
            rules: [{
              required: false,
              message: '请填写固定电话!',
            }, {
              validator(rule, values, callback) {
                callback(!(/^([0-9]{3,4})?[0-9]{7,8}$/.test(values || '')) ? `固定电话格式错误` : undefined)
              },
            }],
          })(
            <Input placeholder="请输入固定电话" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="QQ"
          hasFeedback
        >
          {getFieldDecorator('qQ', {
            initialValue: clueDetail.qQ,
            rules: [{
              required: false,
              message: '请填写QQ!',
            }, {
              validator(rule, values, callback) {
                callback(!(/^[0-9]*$/.test(values || '')) ? `QQ格式错误` : undefined)
              },
            }],
          })(
            <Input placeholder="请输入QQ" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="邮箱"
          hasFeedback
        >
          {getFieldDecorator('email', {
            initialValue: clueDetail.email,
            rules: [{
              type: 'email', message: '邮箱格式不正确!',
            }, {required: false, message: '请填写邮箱!'}],
          })(
            <Input placeholder="请输入邮箱" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="传真"
          hasFeedback
        >
          {getFieldDecorator('fax', {
            initialValue: clueDetail.fax,
            rules: [{
              required: false,
              message: '请填写传真!',
            }, {
              validator(rule, values, callback) {
                callback(!(/^([0-9]{3,4})?[0-9]{7,8}$/.test(values || '')) ? `传真格式错误` : undefined)
              },
            }],
          })(
            <Input placeholder="请输入传真" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="客户来源"
          hasFeedback
        >
          {getFieldDecorator('customerSource', {
            initialValue: clueDetail.customerSource,
            rules: [{required: true, message: '请选择客户来源!'}],
          })(
            <Select {...props}
              showSearch
              placeholder="请选择客户来源"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                customerSourceList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="出生年月"
          hasFeedback
        >
          {getFieldDecorator('birthday', {
            initialValue: birthDate,
            rules: [{required: true, message: '请选择出生年月!'}],
          })(
            <DatePicker onChange={this.onChange} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="毕业院校"
          hasFeedback
        >
          {getFieldDecorator('school', {
            initialValue: clueDetail.school,
            rules: [{required: false, message: '请填写毕业院校!'}],
          })(
            <Input placeholder="请输入毕业院校" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="学历"
          hasFeedback
        >
          {getFieldDecorator('education', {
            initialValue: clueDetail.educationStr,
            rules: [{required: false, message: '请选择学历!'}],
          })(
            <Select {...props}
              showSearch
              placeholder="请选择学历"
              optionFilterProp="children"
              onChange={this.handleChange}
              filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
            >
              {
                educationList.map((d, i) => {
                  return (
                    <Option key={i} value={d.id}>{d.dictName}</Option>
                  )
                })
              }
            </Select>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="毕业时间"
          hasFeedback
        >
          {getFieldDecorator('graduationTime', {
            initialValue: graduateValue,
            rules: [{required: true, message: '请选择毕业时间!'}],
          })(
            <DatePicker onChange={this.onChange} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="工作年限"
          hasFeedback
        >
          {getFieldDecorator('workingLife', {
            initialValue: clueDetail.workingLifeStr,
            rules: [{required: false, message: '请填写工作年限!'}],
          })(
            <Input placeholder="请输入工作年限" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="户口所在地"
        >
          {getFieldDecorator('residence', {
            initialValue: [residenceProvince, residenceCity],
            rules: [{ type: 'array', required: false, message: '请选择户口所在地!' }],
          })(
            <Cascader options={residences} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="户口所在地详细地址"
          hasFeedback
        >
          {getFieldDecorator('residenceDetail', {
            initialValue: clueDetail.residenceDetail,
            rules: [{required: false, message: '请填写户口所在地详细地址!'}],
          })(
            <Input placeholder="请输入户口所在地详细地址" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="现住址"
        >
          {getFieldDecorator('address', {
            initialValue: [addressProvince, addressCity],
            rules: [{ type: 'array', required: false, message: '请选择现住址!' }],
          })(
            <Cascader options={residences} />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="现住址详细地址"
        >
          {getFieldDecorator('addressDetail', {
            initialValue: clueDetail.addressDetail,
            rules: [{required: false, message: '请填写现住址详细地址!'}],
          })(
            <Input placeholder="请输入现住址详细地址" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="民族"
          hasFeedback
        >
          {getFieldDecorator('nation', {
            initialValue: clueDetail.nation,
            rules: [{required: false, message: '请填写民族!'}],
          })(
            <Input placeholder="请输入民族" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="性格"
          hasFeedback
        >
          {getFieldDecorator('nature', {
            initialValue: clueDetail.nature,
            rules: [{required: false, message: '请填写性格!'}],
          })(
            <Input placeholder="请输入性格" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="血型"
          hasFeedback
        >
          {getFieldDecorator('bloodType', {
            initialValue: clueDetail.bloodType,
            rules: [{required: false, message: '请填写血型!'}],
          })(
            <Input placeholder="请输入血型" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="账号编码"
          hasFeedback
        >
          {getFieldDecorator('accountCode', {
            initialValue: clueDetail.accountCode,
            rules: [{required: false, message: '请填写账号编码!'}],
          })(
            <Input placeholder="请输入账号编码" />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="备注"
          hasFeedback
        >
          {getFieldDecorator('remarks', {
            initialValue: clueDetail.remarks,
            rules: [{required: false, message: '请填写备注!'}],
          })(
            <Input placeholder="请输入备注" />
          )}
        </FormItem>
        <FormItem {...tailFormItemLayout}>
          <Button type="primary" onClick={() => { this.operateClue(action) }}>提交</Button>
        </FormItem>
      </Form>
    )
  }
}

class ListTime extends Component { // 日期选择器
  static propTypes = {
    data: PropTypes.object,
  }

  state = {
  }

  render() {
    const data = this.props.data
    return (
      <div className={style.formGroup}>
        <label>{data.name}：</label>
        <div className={style.formItem}>
          <DatePicker onChange={this.onChange} />
        </div>
      </div>
    )
  }
}

class ListRadio extends Component {
  static propTypes = {
    data: PropTypes.object,
  }

  state = {
    value: 1,
  }

  onChange = (e) => {
    console.log('radio checked', e.target.value)
    this.setState({
      value: e.target.value,
    })
  }

  render() {
    const data = this.props.data
    const list = data.list
    const props = {...this.props}
    return (
      <div className={style.formGroup}>
        <label>{data.name}：</label>
        <div className={style.formItem}>
          <RadioGroup {...props} name="radiogroup" defaultValue={String(data.defaultValue)}>
            {
              list.map((d, i) => {
                return (
                  <Radio disabled={d.disabled} key={i} value={String(d.value)}>{d.value}</Radio>
                )
              })
            }
          </RadioGroup>
        </div>
      </div>
    )
  }
}

export {
  ListTextPersonAdd,
  ListTextEnterpriseAdd,
  ListTime,
  ListRadio,
}
